import { View } from '@tarojs/components';
import './sunrise.scss';

export const SunriseUi = function() {
  return  (
    <View className="landscape">
      <View className="mountain"></View>
      <View className="mountain mountain-2"></View>
      <View className="mountain mountain-3"></View>
      <View className="sun-container sun-container-1">
      </View>
      <View className="sun-container">
          <View className="sun"></View>
      </View>
      <View className="cloud"></View>
      <View className="cloud cloud-1"></View>
      <View className="sun-container sun-container-reflection">
          <View className="sun"></View>
      </View>
      <View className="light"></View>
      <View className="light light-1"></View>
      <View className="light light-2"></View>
      <View className="light light-3"></View>
      <View className="light light-4"></View>
      <View className="light light-5"></View>
      <View className="light light-6"></View>
      <View className="light light-7"></View>
      <View className="water"></View>
      <View className="splash"></View>
      <View className="splash delay-1"></View>
      <View className="splash delay-2"></View>
      <View className="splash splash-4 delay-2"></View>
      <View className="splash splash-4 delay-3"></View>
      <View className="splash splash-4 delay-4"></View>
      <View className="splash splash-stone delay-3"></View>
      <View className="splash splash-stone splash-4"></View>
      <View className="splash splash-stone splash-5"></View>
      <View className="lotus lotus-1"></View>
      <View className="lotus lotus-2"></View>
      <View className="lotus lotus-3"></View>
      <View className="front">
          <View className="stone"></View>
          <View className="grass"></View>
          <View className="grass grass-1"></View>
          <View className="grass grass-2"></View>
          <View className="reed"></View>
          <View className="reed reed-1"></View>
      </View>
</View>
  );
}
